import React from 'react';

const Arrow = ({ direction = 'right' }) => {
  const rotationMap = {
    up: -90,
    down: 90,
    left: 180,
    right: 0
  };

  return (
    <svg
      style={{
        transform: `rotate(${rotationMap[direction]}deg)`,
        transition: 'transform 0.3s ease',
        width: '1.5em',
        height: '1.5em'
      }}
      viewBox="0 0 24 24"
    >
      <path
        fill="currentColor"
        d="M8.59 16.59L13.17 12 8.59 7.41 10 6l6 6-6 6-1.41-1.41z"
      />
    </svg>
  );
};

export default Arrow;